@import '../../../../../../src/_vars.scss';

$color: rgba(0, 0, 0, .5);

:host {
  display: flex;
}

::ng-deep mat-card {
  .mat-card-header-text {
    margin: 0
  }

  .mat-mdc-tab-body-wrapper,
  .mat-tab-body-wrapper {
    display: block;
    overflow: visible;
    height: 100%;
    min-height: 200px;
    mat-tab-body {
      height: 100%;
    }
  }
}

.preview-card mat-card-content {
  ::ng-deep .as-init .as-split-gutter, .as-split-area {
    height: auto;
  }
}

.ui-model-tab ::ng-deep .mat-tab-label {
  height: 24px;
  font-size: .85rem;
}

mat-card {
  width: 100%;
  padding: 0;
  mat-card-header, mat-card-content {
    padding: 1em;
  }

  mat-divider {
    margin: 1em 0;
    position: static;
  }

  mat-card-header {
    color: $color;
    background: $gray;
    padding: 8px 20px;
    mat-icon {
      cursor: pointer;
    }
    h3 {
      margin: 0;
    }
  }

  .preview {
    background: $gray;
    padding: 1em;
  }
}




